<!DOCTYPE html>
<html>
<head>
  <div  th:replace="common/header.html"></div>


</head>
<body th:class="${application.sidebarCollapse}">
<div th:replace="common/chart.html"></div>

<div class="wrapper">

  <div th:replace="common/navbar.html"></div>

  <div th:replace="common/aside.html"></div>

  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper"  style="font-size:0.90rem">
    <!-- Content Header (Page header) -->
      <section class="content-header" style="height:38px">
          <div class="container-fluid">
              <div class="row mb-2" style="margin-top: -7px;">
                  <div class="col-sm-6"></div>
                  <div class="col-sm-6">
                      <ol class="breadcrumb float-sm-right">
                          <li class="breadcrumb-item"><a href="javascript:history.back()">返回上级</a></li>
                      </ol>
                  </div>
              </div>
          </div><!-- /.container-fluid -->
      </section>

    <!-- Main content -->
    <section class="content">
      <div class="container-fluid">
        <div class="row">

  <div class="col-md-12">
    <div class="card">
      <div class="card-header">
        <h3 class="card-title"><i class="fas fa-desktop nav-icon"></i>&nbsp;主机列表</h3>
          <div class="card-tools">
              <div class="float-sm-right">
                  <!-- SEARCH FORM -->
                  <form class="form-inline ml-3" th:action="@{'/systemInfo/systemInfoList'}">
                      <button type="button" onclick="searchByOnline('')" class="btn btn-primary btn-sm">全部</button>&nbsp;
                      <button type="button" onclick="searchByOnline('1')" class="btn btn-success btn-sm">在线</button>&nbsp;
                      <button type="button" onclick="searchByOnline('2')" class="btn bg-danger btn-sm">已下线</button>&nbsp;
                      <th:block th:if="${session.LOGIN_KEY.role == 'admin'}">
                      <button type="button" onclick="delChecks('/systemInfo/del')"  class="btn bg-danger btn-sm">删除</button>&nbsp;
                      </th:block>
                      <div class="input-group input-group-sm">
                          <input class="form-control form-control-navbar" name="hostname" autocomplete="off" th:value="${systemInfo.hostname}" type="search" placeholder="输入IP或备注" aria-label="Search">
                          <div class="input-group-append">
                              <button class="btn btn-default" type="submit">
                                  <i class="fas fa-search"></i>
                              </button>
                          </div>
                      </div>
                  </form>
              </div>
          </div>
      </div>
      <!-- /.card-header -->
      <div class="card-body">
        <table class="table table-bordered table-hover">
          <thead>
          <tr>
              <th style="width: 20px"> <input type="checkbox" value="" name="checkall" id="checkall"></th>
            <th style="width: 60px">序号</th>
              <th>系统</th>
              <th>IP</th>

                <th:block th:if="${systemInfo.orderBy  == 'MEM_PER'}">
                    <th:block th:if="${systemInfo.orderType  == 'ASC'}">
                        <th style="cursor:pointer" onclick="searchByOrder('MEM_PER','DESC')">内存%<small    class="text-success mr-1 float-right"><i class="fas fa-arrow-up"></i>&nbsp;</small>
                    </th:block>
                    <th:block th:if="${systemInfo.orderType  == 'DESC'}">
                        <th style="cursor:pointer" onclick="searchByOrder('MEM_PER','ASC')">内存%<small    class="text-success mr-1 float-right"><i class="fas fa-arrow-down" style="color: #dc3545!important;"></i>&nbsp;</small>
                    </th:block>
                </th:block>
                <th:block th:if="${systemInfo.orderBy  ne 'MEM_PER'}">
                    <th style="cursor:pointer" onclick="searchByOrder('MEM_PER','ASC')">内存%<small  class="text-success mr-1 float-right"><i class="fas fa-arrow-up"></i><i class="fas fa-arrow-down" style="color: #dc3545!important;"></i></small>
                </th:block>
            </th>


                <th:block th:if="${systemInfo.orderBy  == 'CPU_PER'}">
                    <th:block th:if="${systemInfo.orderType  == 'ASC'}">
                        <th style="cursor:pointer" onclick="searchByOrder('CPU_PER','DESC')">CPU%<small    class="text-success mr-1 float-right"><i class="fas fa-arrow-up"></i>&nbsp;</small>
                    </th:block>
                    <th:block th:if="${systemInfo.orderType  == 'DESC'}">
                        <th style="cursor:pointer" onclick="searchByOrder('CPU_PER','ASC')">CPU%<small   class="text-success mr-1 float-right"><i class="fas fa-arrow-down" style="color: #dc3545!important;"></i>&nbsp;</small>
                    </th:block>
                </th:block>
                <th:block th:if="${systemInfo.orderBy  ne 'CPU_PER'}">
                    <th style="cursor:pointer" onclick="searchByOrder('CPU_PER','ASC')">CPU%<small   class="text-success mr-1 float-right"><i class="fas fa-arrow-up"></i><i class="fas fa-arrow-down" style="color: #dc3545!important;"></i></small>
                </th:block>
            </th>
              <th title="所有磁盘已使用%">磁盘%</th>
              <th title="CPU核数">CPU核数</th>
              <th title="内存">内存</th>
              <th title="下行带宽速率">下行带宽</th>
              <th title="上行带宽速率">上行带宽</th>
            <th>更新时间</th>
              <th>备注</th>
              <th>操作</th>
          </tr>
          </thead>
          <tbody>
          <th:block th:each="item,iterStat : ${page.list}">
            <tr>
                <td><input type="checkbox" th:value="${item.id}" name="todo2" th:id="${item.id}+'_check'"/></td>
              <td th:text="${iterStat.index+1}"></td>
                <td>
                    <image th:src="${item.image}"></image>
                </td>

                  <th:block th:if="${item.state  == '2'}">
                      <td th:title="${item.hostname}+'超过5分钟未上报状态，可能已下线'"><span  class="badge bg-danger"    th:text="${#strings.abbreviate(item.hostname,20)}"></span>
                  </th:block>
                  <th:block th:if="${item.state  != '2'}">
                      <td th:title="${item.hostname}"><span   th:text="${#strings.abbreviate(item.hostname,20)}"></span>
                  </th:block>
              </td>

              <td>
                  <th:block th:if="${item.memPer >= 90}">
                      <span class="badge bg-danger" th:text="${item.memPer}"></span>
                  </th:block>
                  <th:block th:if="${item.memPer < 90 && item.memPer >= 70  }">
                      <span class="badge bg-warning" th:text="${item.memPer}"></span>
                  </th:block>
                  <th:block th:if="${item.memPer < 70  }">
                      <span class="badge bg-primary" th:text="${item.memPer}"></span>
                  </th:block>
              </td>
              <td>
                  <th:block th:if="${item.cpuPer >= 90}">
                      <span class="badge bg-danger" th:text="${item.cpuPer}"></span>
                  </th:block>
                  <th:block th:if="${item.cpuPer < 90 && item.cpuPer >= 70  }">
                      <span class="badge bg-warning" th:text="${item.cpuPer}"></span>
                  </th:block>
                  <th:block th:if="${item.cpuPer < 70  }">
                      <span class="badge bg-primary" th:text="${item.cpuPer}"></span>
                  </th:block>
              </td>
                <td>
                    <th:block th:if="${item.diskPer >= 90}">
                        <span class="badge bg-danger" th:text="${item.diskPer}"></span>
                    </th:block>
                    <th:block th:if="${item.diskPer < 90 && item.diskPer >= 70  }">
                        <span class="badge bg-warning" th:text="${item.diskPer}"></span>
                    </th:block>
                    <th:block th:if="${item.diskPer < 70  }">
                        <span class="badge bg-primary" th:text="${item.diskPer}"></span>
                    </th:block>
                </td>
                <td th:text="${item.cpuCoreNum}"></td>
                <td th:text="${item.totalMem}"></td>
                <td><span th:text="${item.rxbyt}"></span></td>
                <td><span th:text="${item.txbyt}"></span></td>
              <td th:text="${#dates.format(item.createTime,'yyyy-MM-dd HH:mm:ss')}">Update software</td>
                <td th:text="${item.remark}"></td>
              <td>

                  <button type="button"  th:onclick="view([[${item.id}]])"  class="btn btn-primary btn-sm">系统</button>
                  <button type="button"  th:onclick="viewChart([[${item.id}]])"  class="btn btn-primary btn-sm">图表</button>
                  <button type="button"  th:onclick="viewImage([[${item.id}]])"  class="btn bg-maroon btn-sm">画像</button>
                  <th:block th:if="${session.LOGIN_KEY.role == 'admin'}">
                      <button type="button" class="btn btn-default btn-sm" data-toggle="modal" th:onclick="setHostRemark([[${item.id}]],[[${item.remark}]])" data-target="#modal-default">
                          备注
                      </button>
                      <button type="button"  th:onclick="del([[${item.id}]])"  class="btn bg-gradient-danger btn-sm">删除</button>
                      <th:block th:if="${application.webSsh == 'true'}">
                          <th:block th:if="${#strings.indexOf(item.image,'windows') > -1 }">
                            <button type="button"  data-toggle="modal" th:onclick="setWinConsole([[${item.id}]],[[${item.winConsole}]])"  class="btn btn-success btn-sm" data-target="#modal-default2">远程</button>
                          </th:block>
                          <th:block th:unless="${#strings.indexOf(item.image,'windows') > -1 }">
                              <button type="button"  th:onclick="viewWebSSH([[${item.hostname}]])"  class="btn btn-success btn-sm">SSH</button>
                          </th:block>
                      </th:block>
                  </th:block>
              </td>

            </tr>
          </th:block>

          </tbody>
        </table>
      </div>
      <!-- /.card-body -->
      <div th:replace="common/page.html"></div>
    </div>
    <!-- /.card -->


  </div>

        </div>
      </div>
    </section>
  </div>



    <div class="modal fade" id="modal-default">
        <div class="modal-dialog">
            <form method="post" id="form2" th:action="@{'/systemInfo/save'}">
            <div class="modal-content" style="font-size:0.90rem">
                <div class="modal-header">
                    <h4 class="modal-title">编辑主机备注</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <p>
                        <input type="hidden" id="id" name="id"/>
                        <input type="text"  autocomplete="off" class="validate[required,maxSize[40] form-control" name="remark" id="remark" placeholder="如：数据清洗服务器。输入完成请点击保存">
                    </p>
                </div>
                <div class="modal-footer justify-content-between">
                    <button type="button" class="btn btn-default  btn-sm" data-dismiss="modal">关闭</button>
                    <button type="button" onclick="ajaxSaveRemark()" class="btn btn-primary btn-sm">保存</button>
                </div>
            </div>
            </form>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

    <div class="modal fade" id="modal-default2">
        <div class="modal-dialog">
            <form method="post" id="form3" th:action="@{'/systemInfo/saveWinConsole'}">
                <div class="modal-content" style="font-size:0.90rem">
                    <div class="modal-header">
                        <h4 class="modal-title">windows远程服务http地址</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <p>
                            <input type="hidden" id="id2" name="id"/>
                            <input type="text"  autocomplete="off" class="validate[required,maxSize[255] form-control" name="winConsole" id="winConsole" placeholder="http://10.102.11.2:9000">
                        </p>
                    </div>
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-default  btn-sm" data-dismiss="modal">关闭</button>
                        <button type="button" onclick="ajaxSaveWinConsole()" class="btn btn-primary btn-sm">保存 & 连接</button>
                        <button type="button" onclick="viewWinConsole()" class="btn btn-primary btn-sm">连接</button>
                    </div>
                </div>
            </form>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

  <div th:replace="common/footer.html"></div>
    <script th:src="@{'/static/js/jQuery/jquery.form.min.js'}" type="text/javascript" charset="utf-8"></script>

</div>
<!-- ./wrapper -->

<script th:src="@{'/static/js/host.js'}"></script>
<script th:inline="javascript">

    var msg = [[${msg}]];
    if(msg!='' && msg!=null){
        toastr.info(msg);
    }
</script>

</body>
</html>
